<template>
	<view>
		<u-sticky :enable="stickyEnable">
			<view class="padding-sm bg-white">
				<u-search placeholder="搜索姓名" v-model="page.cond.realName" @search="search" @custom="search"></u-search>
			</view>
		</u-sticky>
		<tui-swipe-action class="solid-top" :actions="actions" v-for="(item, index) in result.records" :key="item.id" :params="item" @click="actionHandler">
			<template v-slot:content>
				<view class="padding flex align-center">
					<view class="flex-sub">{{item.realName || item.nickName}} 【{{item.loginName}}】</view>
					<view>序号：{{item.seq || 0}}</view>
				</view>
			</template>
		</tui-swipe-action>
		<u-loadmore :status="result.current < result.pages?'loading':'nomore'" />
		<coco-fixed-button @click.native="edit"></coco-fixed-button>
	</view>
</template>

<script>
	export default {
		onLoad: function(option) {
			this.page.cond.orgId = option.orgId || null;
			if (option.orgId && option.orgId !== 'single') {
				this.orgId = option.orgId;
			}
			this.list();
		},
		onShow: function() {
			this.stickyEnable = true;
		},
		onHide: function() {
			this.stickyEnable = false;
		},
		onReady: function() {},
		onReachBottom: function() {
			if (this.result.current < this.result.pages) {
				this.page.current += 1;
				this.list();
			}
		},
		data() {
			return {
				stickyEnable: false, // 吸顶组件在页面隐藏时禁用
				show: false,
				orgId: null, // 组织ID
				actions: [{
						name: '修改',
						width: 70,
						fontsize: 30,
						color: '#fff',
						background: '#ffaa00'
					},
					{
						name: '删除',
						width: 70,
						fontsize: 30,
						color: '#fff',
						background: '#dd524d'
					},
					{
						name: '组织',
						width: 70,
						fontsize: 30,
						color: '#fff',
						background: '#00aaff'
					},
					{
						name: '角色',
						width: 70,
						fontsize: 30,
						color: '#fff',
						background: '#00aa7f'
					}
				],
				page: {
					current: 1,
					size: 20,
					total: 0,
					orders: [{
						column: "seq",
						asc: true
					}],
					cond: {},
				}, // 分页查询请求
				result: {
					current: 1,
					pages: 1,
					records: []
				}, // 分页查询结果
			};
		},
		methods: {
			// 查询
			search() {
				this.page.current = 1;
				this.list();
			},
			// 编辑
			edit(item) {
				uni.navigateTo({
					url: `user-edit?id=${item.id || ''}&orgId=${this.orgId || ''}`,
					events: {
						refresh: () => {
							this.page.current = 1;
							this.list();
						}
					}
				});
			},
			// user list
			list() {
				this.$http.post("/admin/sys/rbac/user/list", this.page, res => {
					let result = res.data || this.result;
					if (this.page.current > 1) {
						result.records = this.result.records.concat(result.records);
					}
					this.result = result;
				}, false, false, true);
			},
			// 删除
			remove(item) {
				this.$utils.modal("提示", "是否删除？", true, flag => {
					if (flag) {
						this.$http.post("/admin/sys/rbac/user/remove", item, res => {
							let records = this.result.records || [];
							records.splice(records.findIndex(obj => obj.id === item.id), 1);
							this.result.records = records;
						}, true, true, true);
					}
				});
			},
			// 滑动菜单
			actionHandler(obj) {
				if (obj.index === 0) {
					this.edit(obj.item);
				} else if (obj.index === 1) {
					this.remove(obj.item);
				} else if (obj.index === 2) {
					let userName = obj.item.realName || obj.item.nickName || obj.item.loginName;
					uni.navigateTo({
						url: `org-tree?userId=${obj.item.id}&userName=${userName}`,
						events: {
							refresh: () => {
								this.page.current = 1;
								this.list();
							}
						}
					});
				} else if (obj.index === 3) {
					let item = {
						id: obj.item.id,
						loginName: obj.item.loginName
					};
					uni.navigateTo({
						url: `role-select?item=${JSON.stringify(item)}`
					});
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
</style>
